<template>
  <el-dialog
    :title="$t('message.dyxp')"
    :visible.sync="showDialog"
    :close-on-click-modal="modalDialog"
    :close-on-press-escape="modalDialog"
    top="15vh !important"
    :before-close="cancelDialog"
    width="600px"
    append-to-body
  >
    <el-table
      :data="detail.dataList"
      border
      fit
      :header-row-class-name="'table-header'"
      class="doumee-element-table"
    >
      <el-table-column
        align="center"
        :label="$t('message.xpmc')"
        prop="xpmc"
      />
      <el-table-column :label="$t('message.caozuo')" :width="$i18n.locale === 'ZH'? 100 : 200" align="center" fixed="right">
        <template slot-scope="scope">
          <div class="flex-cc">
            <el-button
              v-preventReClick
              type="text"
              @click="printTC(scope.$index)"
            >{{ $t('message.dyxp') }}</el-button>
          </div>
        </template>
      </el-table-column>
    </el-table>
  </el-dialog>
</template>

<script>
import store from '@/store'
export default {
  data() {
    return {
      detail: {},
      modalDialog: store.getters.dialog,
      showDialog: false, // 弹窗
      listLoading: false
    }
  },
  methods: {
    showDetail(detail) {
      this.showDialog = true
      const obj = { ...detail }
      obj.dataList.forEach(s => {
        s.xpmc = s.goodsList[0].name
      })
      this.detail = obj
    },
    printTC(index) {
      this.$emit('printd', index)
    },
    cancelDialog() {
      this.showDialog = false
      this.$emit('cancelDialog')
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
